﻿@model MvcXRepair.ViewModel.AccountRegisterViewModel
@{
    ViewBag.Title = "Register";
}

<hgroup class="title">
    <h1>@ViewBag.Title.</h1>
    <h2>Create a new account.</h2>
</hgroup>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary()

    <div id="jsValidationMsg" class="validation-summary-errors">
        <ul></ul>
    </div>

    <fieldset>
        <legend>Registration Form</legend>
        <ol>
            <li>
                @Html.LabelFor(m => m.EmailAddress)
                @Html.TextBoxFor(m => m.EmailAddress, new { @id = "txtEmail" })
            </li>
            <li>
                @Html.LabelFor(m => m.UserName)
                @Html.TextBoxFor(m => m.UserName, new { @id = "txtUsername" })
            </li>
            <li>
                @Html.LabelFor(m => m.Password)
                @Html.PasswordFor(m => m.Password)
            </li>
            <li>
                @Html.LabelFor(m => m.ConfirmPassword)
                @Html.PasswordFor(m => m.ConfirmPassword)
            </li>
        </ol>
        <input type="submit" value="Register" />
    </fieldset>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}
@section lazy
{
    <script type="text/javascript">
        $(function () {
            $("#txtEmail").change(function () {
                var newEmail = $(this).val();
                var invalid = false;

                if(ValidateEmail(newEmail) == false)
                {
                    // Js validation      
                    $("#jsValidationMsg > ul > li.emailIssue").remove();
                    $("#jsValidationMsg > ul").append("<li class='emailIssue'>This email address is not valid.</li>"); 
                    invalid = true;
                }
                else
                {
                    // Ajax validation
                    $.ajax({
                        url: "/User/CheckRegistrationEmailExisting",
                        data: "email=" + newEmail,
                        type: 'POST',
                        dataType: "json",
                        async: false,
                        success: function (resp) {
                            if(resp == true)
                            {                                  
                                $("#jsValidationMsg > ul > li.emailIssue").remove();
                                $("#jsValidationMsg > ul").append("<li class='emailIssue'>This email address is occupied.</li>");
                                invalid = true;
                            }                            
                        }
                    });
                }

                if(!invalid)
                {
                    // All check passed, remove alarm text
                    $("#jsValidationMsg > ul > li.emailIssue").remove();
                }
            });

            $("#txtUsername").change(function () {
                var username = $(this).val();

                if(!username == false)
                {
                    $.ajax({
                        url: "/User/CheckRegistrationUsernameExisting",
                        data: "username=" + username,
                        type: 'POST',
                        dataType: "json",
                        async: false,
                        success: function (resp) {
                            if(resp == true)
                            {                                  
                                $("#jsValidationMsg > ul > li.usernameIssue").remove();
                                $("#jsValidationMsg > ul").append("<li class='usernameIssue'>This username is occupied.</li>");                                
                            }                            
                        }
                    });
                }
                else
                {
                    $("#jsValidationMsg > ul > li.usernameIssue").remove();
                }
            });
        });

        function ValidateEmail(elementValue){        
            var emailPattern = @Html.Raw(@"/\S+@\S+\.\S+/");
            return emailPattern.test(elementValue) && !elementValue == false;
        }   

    </script>
}
